<template>
	<view class="wrapForm">
		<view class="bgLine flex jst-between pL25 pR25 pT20 pB20"></view>

		<view class="wrapFormBody pL15 pR15 pT15 rzBox">
			<view class="font18">填写基本信息</view>
			<view class="mT10 mB10 font15"><text class="u-red">*</text>请选择身份类型</view>
			<view class="flex w100">
				<view class="w50 mR10 sfSelItem" @click="changeId(0)" :class="current==0?'active':''">
					<view class="font15  line24">企业身份</view>
					<view class="font13 line24">请添加企业信息</view>
				</view>
				<view class="w50 mL10 sfSelItem" @click="changeId(1)" :class="current==1?'active':''">
					<view class="font15  line24">个人身份</view>
					<view class="font13 line24">请添加个人息</view>
				</view>
			</view>
			<u-form v-show="current==0" :label-width="200" :error-type="['toast']" :label-style="{'font-size':'30rpx'}"
				class="xf-wrap-form" ref="dataForm" :rules="rules" :model="formData">
				<u-form-item :required="true" label="企业名称" :label-position="'top'" prop="comName">
					<u-input class="t-right" placeholder="请输入企业名称" v-model="formData.comName" />
				</u-form-item>
				<u-form-item :required="true" label="企业统一信用代码" :label-position="'top'" prop="comCode">
					<view class="w100 flex alg-center jst-between">
						<u-input class="t-right" placeholder="请输入企业统一信用代码" v-model="formData.comCode" />
					</view>
				</u-form-item>
				<u-form-item :required="true" label="联系人" :label-position="'top'" prop="comContacts">
					<view class="w100 flex alg-center jst-between">
						<u-input class="t-right" placeholder="请输入联系人" v-model="formData.comContacts" />
					</view>
				</u-form-item>
				<u-form-item :required="true" label="联系电话" :label-position="'top'" prop="comContactsPhone">
					<view class="w100 flex alg-center jst-between">
						<u-input class="t-right" placeholder="请输入联系电话" v-model="formData.comContactsPhone" />
					</view>
				</u-form-item>
				<u-form-item :required="true" label="身份证号" :label-position="'top'" prop="comContactsIdcard">
					<view class="w100 ">
						<u-input class="t-right" placeholder="请输入身份证号" v-model="formData.comContactsIdcard" />
					</view>
				</u-form-item>
				<u-form-item :required="true" label="企业地址" :label-position="'top'" prop="address">
					<view class="w100 flex alg-center jst-between">
						<view class="w70"><u-input :disabled="true" class="t-right" placeholder="请选择地址"
								v-model="formData.address" />
						</view>
						<image @click="chooseLocation" class="imgW36" :src="resources.posIcon" mode=""></image>
					</view>
				</u-form-item>
				<u-form-item :required="true" label="详细地址" :label-position="'top'" prop="comBelongAddress">
					<view class="w100 ">
						<u-input class="t-right" placeholder="请输入详细地址" v-model="formData.comBelongAddress" />
					</view>
				</u-form-item>
				<u-form-item :required="true" label="所属驿站" :label-position="'top'" prop="organizationName">
					<view class="w100 ">
						<u-input type="select" class="t-right" placeholder="请选择所属驿站" v-model="formData.organizationName"
							@click="showPicker" />
					</view>
				</u-form-item>
			</u-form>
			<u-form v-show="current==1" :label-width="200" :error-type="['toast']" :label-style="{'font-size':'30rpx'}"
				class="xf-wrap-form" ref="personForm" :rules="personRulers" :model="personData">
				<u-form-item :required="true" label="真实姓名" :label-position="'top'" prop="realName">
					<view class="w100">
						<u-input placeholder="请输入真实姓名" v-model="personData.realName" />

					</view>
				</u-form-item>
				<u-form-item :required="true" label="身份证号" :label-position="'top'" prop="idCard">
					<view class="w100 ">
						<u-input placeholder="请输入身份证号" v-model="personData.idCard" />
					</view>
				</u-form-item>
				<u-form-item :required="true" label="联系电话" :label-position="'top'" prop="userPhoneNo">
					<view class="w100 ">
						<u-input placeholder="请输入联系电话" v-model="personData.userPhoneNo" />
					</view>
				</u-form-item>
				<u-form-item :required="true" label="工作地址" :label-position="'top'" prop="address">
					<view class="w100 flex alg-center jst-between">
						<view class="w70"><u-input :disabled="true" placeholder="请选择地址" v-model="personData.address" />
						</view>
						<image @click="chooseLocation" class="imgW36" :src="resources.posIcon" mode=""></image>
					</view>
				</u-form-item>
				<u-form-item :required="true" label="详细地址" :label-position="'top'" prop="homeAddress">
					<view class="w100 ">
						<u-input placeholder="请输入详细地址" v-model="personData.homeAddress" />
					</view>
				</u-form-item>
				<u-form-item label="期望工作" prop="expectedPositionText" :label-position="'top'">
					<view class="w100">
						<u-input type="select" placeholder="请选择期望职位" @click="openJobType"
							v-model="personData.expectedPositionText"></u-input>
					</view>
				</u-form-item>
				<u-form-item :required="true" label="所属驿站" :label-position="'top'" prop="organizationName">
					<view class="w100 ">
						<u-input type="select" class="t-right" placeholder="请选择地址" v-model="personData.organizationName"
							@click="showPicker" />
					</view>
				</u-form-item>
			</u-form>
		</view>
		<view class="flex jst-center  bottomFixed pT15 pB15 bgf">
			<view class="pointer rightNowPay u-f font15 t-center" @click="saveMyInfo">
				保存
			</view>
		</view>
		<u-modal v-model="showBox" :show-confirm-button="false" :show-title="false">
			<view class="pL15 pR15 pT15 pB15">
				<view class="t-center bold">温馨提示</view>
				<view class="flex jst-center mT25 mB25">
					您还未授权请先授权!
				</view>
				<view class="flex jst-center">
					<button type="primary" class="btnLogin" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
						<view class="marL20 font34">手机号一键授权登录</view>
					</button>
				</view>
				<!-- <button @click="login">test account login</button> -->
			</view>
		</u-modal>
		<jobType ref="jobType" @getSelV="getSelV" :isMultie="true" :title="'请选择期望职位'"
			:defaultValue="personData.expectedPosition" :showLength="true" :checkLength="3"></jobType>
		<xfTreePicker :defalutValue="formData.organizationId" :selectParent="false" ref="treePicker" :multiple="false"
			@select-change="selectChange" title="所属驿站" :localdata="deptLis" valueKey="id" textKey="name"
			codeKey="orgCode" childrenKey="children"></xfTreePicker>
	</view>
</template>
<script>
	import {
		addBrokerCom,
		brokerSaveUser
	} from "@/api/economicInterface/user.js"

	import {
		getOrgTree,
		licenseFreelogin,
		getCompanyInfo,
		getUserInfo,
		loginAccount
	} from "@/api/common.js"
	import selAreaMinxs from "@/utils/selArea.js"
	import {
		chatUserInfo
	} from "@/api/chat.js"
	import {
		chooseLocal
	} from "@/libs/map.js"
	import jobType from "@/components/job/jobType/index.vue"
	export default {
		mixins: [selAreaMinxs],
		components: {
			jobType
		},
		data() {
			return {
				showBox: true,
				current: 0,
				id: null,
				info: {},
				formData: {
					xfOddUserId: "",
					"comName": "",
					"comBelongAddress": "",
					"comCode": "",
					"comContactsIdcard": "",
					"comBusinessLicense": "",
					"comLongitude": "",
					"comLatitude": "",
					"provinceId": "",
					organizationName: "",
					organizationId: "",
					"provinceName": "",
					comContacts: "",
					comContactsPhone: "",
					"cityId": "",
					"cityName": "",
					"areaId": "",
					"areaName": "",
					address: ""
				},
				personData: {
					xfOddUserId: "",
					"realName": "",
					"idCard": "",
					userPhoneNo: "",
					"organizationId": "",
					organizationName: "",
					"homeAddress": "",
					expectedPosition: '',
					expectedPositionText: '',
					"provinceId": "",
					"provinceName": "",
					"cityId": "",
					"cityName": "",
					"areaId": "",
					"areaName": "",
					"townId": "",
					"townName": "",
					address: "",
					longitude: "",
					latitude: "",
				},
				deptLis: [],
				rules: {
					comName: [{
						required: true,
						message: '请输入企业名称',
						trigger: ['change', 'blur'],
					}],
					address: [{
						required: true,
						message: '请选择企业地址',
						trigger: ['change', 'blur'],
					}],
					comBelongAddress: [{
						required: true,
						message: '请输入详细地址',
						trigger: ['change', 'blur'],
					}],
					comContactsIdcard: [{
						required: true,
						message: '请输入身份证号',
						trigger: ['change', 'blur'],
					}, {
						rule: /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X|x)$/,
						msg: '请正确输入您的身份证号码15-18位'
					}],
					comContacts: [{
						required: true,
						message: '请输入联系人姓名',
						trigger: ['change', 'blur'],
					}],
					organizationName: [{
						required: true,
						message: '请选择所属服务站点',
						trigger: ['change', 'blur'],
					}],
					comContactsPhone: [{
						required: true,
						message: '联系电话不能为空',
						trigger: ['change', 'blur']
					}, {
						pattern: /^1[3456789]\d{9}$/,
						message: '手机号格式不正确',
						trigger: ['change', 'blur']
					}],

					comCode: [{
						required: true,
						message: '请输入统一信用代码',
						trigger: ['change', 'blur'],
					}, {
						pattern: /^[a-zA-Z0-9]+$/,
						message: '统一信用代码格式不正确',
						trigger: ['change', 'blur'],
					}]


				},
				personRulers: {
					realName: [{
						required: true,
						message: '请输入真实姓名',
						trigger: ['change', 'blur'],
					}],
					address: [{
						required: true,
						message: '请选择地址',
						trigger: ['change', 'blur'],
					}],
					homeAddress: [{
						required: true,
						message: '请输入详细地址',
						trigger: ['change', 'blur'],
					}],
					organizationName: [{
						required: true,
						message: '请选择所属服务站点',
						trigger: ['change', 'blur'],
					}],
					userPhoneNo: [{
						required: true,
						message: '联系电话不能为空',
						trigger: ['change', 'blur']
					}, {
						pattern: /^1[3456789]\d{9}$/,
						message: '手机号格式不正确',
						trigger: ['change', 'blur']
					}],
					idCard: [{
						required: true,
						message: '请输入身份证号',
						trigger: ['change', 'blur'],
					}, {
						rule: /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X|x)$/,
						msg: '请正确输入您的身份证号码15-18位'
					}]

				}
			}
		},
		onReady() {
			this.$refs.dataForm.setRules(this.rules);
			this.$refs.personForm.setRules(this.personRulers);

			// this.getTreeOpt()
		},
		onLoad(e) {
			this.id = e.id ? e.id : '';
			let q = decodeURIComponent(e.q);
			this.id = q.split('=')[1];
			this.formData.xfOddUserId = this.id;
			this.personData.xfOddUserId = this.id;

		},
		methods: {
			//切换身份获取企业或个人信息
			changeId(type) {
				let uInfo = this.xf.onlineUtils.getUserInfo()
				this.current = type;
				if (type == 0 && uInfo.isAuthCompany == 1 || type == 1 && uInfo.isAuthPersonal == 1) {
					this.getCompanyInfoOpt(type + 1)
				}

			},
			//企业身份获取企业信息
			getCompanyInfoOpt(type) {
				getCompanyInfo({
					type: type + ""
				}).then(res => {
					let info = res?.result;
					if (type == 1) {
						let data = {
							"comName": info?.comName,
							"comBelongAddress": info?.comBelongAddress,
							"comCode": info?.comCode,
							"comContactsIdcard": info?.idCard,
							"comBusinessLicense": "",
							"comLongitude": info?.latitude,
							"comLatitude": info?.longitude,
							organizationName: info?.organizationName,
							organizationId: info?.organizationId,
							comContacts: info?.contact,
							comContactsPhone: info?.contactPhone,
							"provinceId": info?.provinceId,
							"provinceName": info?.provinceName,
							"cityId": info?.cityId,
							"cityName": info?.cityName,
							"areaId": info?.areaId,
							"areaName": info?.areaName,
							address: ""
						}
						data.address = info?.provinceName + info?.cityName + info?.areaName;
						this.formData = {
							...this.formData,
							...data
						};
					} else {
						let data = {
							"realName": info?.realName,
							"idCard": info?.idCard,
							userPhoneNo: info?.contactPhone,
							"organizationId": info?.organizationId,
							organizationName: info?.organizationName,
							"homeAddress": info?.comBelongAddress,
							expectedPosition: info?.expectedPosition,
							expectedPositionText: info?.expectedPositionText,
							"provinceId": info?.provinceId,
							"provinceName": info?.provinceName,
							"cityId": info?.cityId,
							"cityName": info?.cityName,
							"areaId": info?.areaId,
							"areaName": info?.areaName,
							"townId": "",
							"townName": "",
							sex: info?.sex,
							sexText: info?.sexText,
							address: "",
							longitude: info?.longitude,
							latitude: info?.latitude,
						}
						data.address = info?.provinceName + info?.cityName + info?.areaName;
						this.personData = {
							...this.personData,
							...data
						};
					}
				})
			},
			getPhoneNumber(e) {
				//#ifdef MP-WEIXIN
				if (e.detail.errMsg == "getPhoneNumber:ok") {
					licenseFreelogin({
						code: e.detail.code,
						//0是微信  1是支付宝
						weChatOrAliPay: "0",
						terminalType: 10, //登陆终端 默认10是移动端
						izRegister: 1 //是否注册 0 否  1是
					}).then(async res => {
						if (res.success) {
							this.userStore.setToken(res.result.token);
							let info = res.result?.xflinggongOddUserInfoVo;
							this.info = info;
							this.userStore.setAuthStatus(info.authStatus)
							this.userStore.setUserId(info?.id);
							this.userStore.setUserInfo(JSON.stringify(info))
							this.getTreeOpt();
							this.changeId(0)
							chatUserInfo().then(res => {})
							getApp().$vm.init()
							this.showBox = false;

						}
					});
				}
				// #endif
			},
			login() {
				loginAccount({
					username: "13212345677",
					password: "XunFeng@2023",
					terminalType: "10"
				}).then(res => {
					this.userStore.setToken(res.result.token);
					let info = res.result?.xflinggongOddUserInfoVo;
					this.info = info;
					this.userStore.setAuthStatus(info.authStatus)
					this.userStore.setUserId(info?.id);
					this.userStore.setUserInfo(JSON.stringify(info))
					this.getTreeOpt();
					this.changeId(0)
					chatUserInfo().then(res => {})
					getApp().$vm.init()
					this.showBox = false;


				})

			},
			showPicker() {
				this.$refs.treePicker._show();
			},
			//打开全部职位选择框
			openJobType() {
				this.$refs.jobType.openPoup()
			},
			getSelV(e, v) {
				this.personData.expectedPosition = e;
				this.personData.expectedPositionText = v;

			},
			//监听选择（ids为数组）
			selectChange(ids, code, names) {
				if (this.current == 0) {
					this.formData.organizationName = names;
					this.formData.organizationId = ids;
				} else {
					this.personData.organizationName = names;
					this.personData.organizationId = ids;
				}
			},
			async chooseLocation() {
				let res = await chooseLocal();
				let r = res.address + res.name;
				let d = this.regionDiscern(r)
				if (this.current == 0) {
					this.formData.provinceId = d.data.province.code;
					this.formData.cityId = d.data.city.code;
					this.formData.areaId = d.data.area.code;
					this.formData.provinceName = d.data.province.name;
					this.formData.cityName = d.data.city.name;
					this.formData.areaName = d.data.area.name;
					this.formData.address = this.formData.provinceName + this.formData.cityName + this.formData
						.areaName
					this.formData.comLatitude = res.latitude;
					this.formData.comLongitude = res.longitude;
					this.formData.comBelongAddress = d.data.address;
				} else {
					this.personData.provinceId = d.data.province.code;
					this.personData.cityId = d.data.city.code;
					this.personData.areaId = d.data.area.code;
					this.personData.provinceName = d.data.province.name;
					this.personData.cityName = d.data.city.name;
					this.personData.areaName = d.data.area.name;
					this.personData.address = this.personData.provinceName + this.personData.cityName + this.personData
						.areaName
					this.personData.latitude = res.latitude;
					this.personData.longitude = res.longitude;
					this.personData.homeAddress = d.data.address;
				}

			},
			getTreeOpt() {
				getOrgTree().then(res => {
					this.deptLis = res.result[0].children;
				})
			},
			saveMyInfo() {
				this.xf.onlineUtils.toast()
				if (this.current == 0) {
					let data = this.xf.deepClone(this.formData)
					delete data.address
					this.$refs.dataForm.validate(async valid => {
						if (valid) {
							addBrokerCom(this.formData).then(res => {
								if (res.success == true) {
									uni.showToast({
										icon: 'none',
										title: '添加成功!'
									})
									setTimeout(() => {
										uni.reLaunch({
											url: "/pages/userPage/home/index"
										})
									}, 3000)
								}
							})
						}
					})
				} else {
					let data = this.xf.deepClone(this.personData)
					delete data.address
					this.$refs.personForm.validate(async valid => {
						if (valid) {
							brokerSaveUser(this.personData).then(res => {
								if (res.success == true) {
									uni.showToast({
										icon: 'none',
										title: '添加成功!'
									})
									setTimeout(() => {
										uni.reLaunch({
											url: "/pages/userPage/home/index"
										})
									}, 3000)
								}
							})
						}
					})
				}

			}
		}
	}
</script>
<style lang="scss">
	page {
		height: 100%;
		background-color: #fff;
	}

	.wrapFormBody {
		padding-bottom: 200rpx;

		.reasonBox {
			.u-input {
				border-radius: 20rpx !important;
			}
		}
	}
</style>
<style lang="scss" scoped>
	.btnLogin {
		width: 670rpx;
		height: 100rpx;
		line-height: 100rpx;
		background: #386AFF;
		/* #ifdef  MP-ECONOMIC */
		background: #00A0C6;
		/* #endif */
		font-size: 32rpx;
		border-radius: 30rpx 30rpx 30rpx 30rpx;
	}

	.wrapForm {
		.sfSelItem {

			background: #F8F8F8;
			border-radius: 20rpx;
			padding: 20rpx 30rpx;
			border: 2rpx solid transparent;
			color: #8d8d8d;

			&.active {
				border-radius: 20rpx;
				border: 2px solid #00A0C6;
				background: #EBFCFF;
				color: #00A0C6;
			}


		}

		.rzCardBox {

			height: 128rpx;
			background: #F8F8F8;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			margin-top: 60rpx;

			&:last-child {
				margin-top: 30rpx;
			}

			.imgRzCard {
				width: 40rpx;
				height: 32rpx;
			}
		}

		height: 100%;
		padding-bottom: 100rpx;

		.wrapFormBody {
			margin-top: -30rpx;
			border-radius: 40rpx 40rpx 0 0;
			background: #fff;
		}

		.uni-forms-item {
			align-items: center !important;
		}

		.uni-input-placeholder {
			text-align: left !important;
			color: #BDBDBD !important;
		}
	}

	.bgLine {
		background-color: #EBFCFF;
		width: 100%;
		// height: 60rpx;
		padding: 30rpx 40rpx;

		.rzImg {
			width: 168rpx;
			height: 192rpx;
		}
	}


	.rightNowPay {
		width: 670rpx;
		height: 100rpx;
		line-height: 100rpx;
		background: #00A0C6;
		border-radius: 30rpx;

	}
</style>